<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品类别管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css" href="common/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="common/bootstrap/css/bootstrap.css" media="all">
    <link rel="stylesheet" type="text/css" href="common/global.css" media="all">
    <link rel="stylesheet" type="text/css" href="css/personal.css" media="all">
</head>
<body>
<section class="layui-larry-box">
    <div class="larry-personal">
        <div class="layui-tab">
            <blockquote class="layui-elem-quote categories_search">
                <div class="layui-inline">
                    <a class="layui-btn layui-btn-normal categoriesAdd_btn">添加商品类别</a>
                </div>
                <div class="layui-inline">
                    <a class="layui-btn layui-btn-danger batchDel">批量删除</a>
                </div>
                <div class="layui-inline">
                    <div class="layui-form-mid layui-word-aux">本页面刷新后除新添加的文章外所有操作无效，关闭页面所有数据重置</div>
                </div>
                <div class="layui-inline">
                    <span class="layui-form-mid">共有<span style="font-weight: bold"> 4 </span>条数据</span>
                </div>
            </blockquote>

            <!-- 操作日志 -->
            <div class="layui-form categories_list">
                <table class="layui-table">
                    <colgroup>
                        <col width="10%">
                        <col>
                        <col>
                        <col>
                    </colgroup>
                    <thead>
                    <tr>
                        <th><input name="" lay-skin="primary" lay-filter="allChoose" id="allChoose" type="checkbox">
                            <div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i
                                    class="layui-icon"></i></div>
                        </th>
                        <th>商品类别名称</th>
                        <th>创建日期</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody class="categories_content">
                        <tr>
                            <td>
                                <input name="checked" lay-skin="primary" lay-filter="choose" type="checkbox">
                                <div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i
                                        class="layui-icon"></i></div>
                            </td>
                            <td>茶叶</td>
                            <td>2018-4-17</td>
                            <td>
                                <a class="layui-btn layui-btn-mini categories_edit"><i class="iconfont icon-edit"></i> 编辑</a>
                                <a class="layui-btn layui-btn-danger layui-btn-mini categories_del" data-id="1"><i
                                        class="layui-icon"></i> 删除</a>
                            </td>
                        </tr>
                    </tbody>
                </table>
                <div class="larry-table-page clearfix">
                    <div id="page" class="page"></div>
                </div>
            </div>

        </div>
    </div>

</section>
<script type="text/javascript" src="common/layui/layui.js"></script>
<script type="text/javascript" src="js/commonAction.js"></script>
<script type="text/javascript">

    var appConfig = {
        name: "categories",    //需要和页面名称对应
        title: "类别",    //显示的名称
        addUrl: "permissionAdd.html",   //添加弹框的路径
        editUrl: "permissionEdit.html",      //修改弹框的路径

        //批量删除Ajax
        batchDel: function (data) {     //Array data 得到的是 需要删除的id
            data.each(function (index,value) {
                console.log(value);

                //todo:在此处添加批量删除记录的ajax

            });

        },
        del: function (data) {

            console.log(data);

            //todo:在此处添加删除记录的ajax
        }
    };
    layui.use(['jquery', 'layer', 'element', 'laypage'], function () {
        window.jQuery = window.$ = layui.jquery;
        window.layer = layui.layer;
        var element = layui.element(),
            laypage = layui.laypage;


        laypage({
            cont: 'page',
            pages: 10 //总页数
            ,
            groups: 5 //连续显示分页数
            ,
            jump: function (obj, first) {
                //得到了当前页，用于向服务端请求对应数据
                var curr = obj.curr;
                if (!first) {
                    //layer.msg('第 '+ obj.curr +' 页');
                }
            }
        });

    });
</script>
</body>
</html>